<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>前端知识总结</title>
    <style>
        .main{
            width: 960px;
            margin: 0 auto;
        }
        .item-every>h1{
            margin: 0;
            padding: 0;
        }
        .item-every>p{
            margin: 0;
            padding: 0;
            margin-top: 20px;
            font-size: 20px;
        }
        pre{
            font-size: 18px;
        }
    </style>
    
</head>
<body>
    <div class="main">
        <!-- 每一个信息 -->
        <div class="item-every">
            <h2>将后台数据遍历只修改部分需要的表单数据</h2>
<pre>
let needKey = ['entid', 'appName', 'timeRate', 'bundleIdentifier', 
'developType', 'address', 'appType', 'meetingRoomType', 'remark','appId','status','teamExpandType']
needKey.forEach(item => {
    this.form[item] = res.data
})
</pre>
        </div>
         <!-- 每一个信息 -->
         <div class="item-every">
            <h2>axios中post请求穿url拼接形式的参数</h2>
<pre>
function transFormData(data){
    let  params = Object.keys(data).map(function (key) { 
        return encodeURIComponent(key) + "=" + encodeURIComponent(data[key]); 
    }).join("&");
    return params
}
</pre>
        </div>
             <!-- 每一个信息 -->
         <div class="item-every">
            <h2>h5页面唤起手机app，没有就下载</h2>
<pre>
function openApp() {
            var downloadTimer
            let url_scheme = 'android.app/main';  //通过 Url scheme 来实现的H5与安卓、苹果应用之间的跳转链接
            let downUrl_ios = 'https://itunes.apple.com/cn/app/id1317248738?mt=8';  // ios下载页链接
            let downUrl_android = 'youbizhi/download/android/youbizhi_v0.3.0_20191227_alpha_1.apk';   // android下载页链接
            var ua = window.navigator.userAgent.toLowerCase();
            // 判断是不是在微信环境下
            if (ua.match(/MicroMessenger/i) == 'micromessenger') {
                alert("请在浏览器内打开");
            }else{
                        if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) {
                        window.location.href = url_scheme; //下载页链接
                        downloadTimer = setTimeout(function () {
                                window.location.href = downUrl_ios;//ios下载地址
                        }, 3000);
                    } else if (navigator.userAgent.match(/android/i)) { //如果当前是安卓
                        window.location.href = url_scheme; //调起APP
                        downloadTimer =setTimeout(function () {
                                window.location.href = downUrl_android; //android下载地址
                        }, 3000);
                    }
                    document.addEventListener('visibilitychange webkitvisibilitychange', function () {
                            // 如果页面隐藏，推测打开scheme成功，清除下载任务
                            if (document.hidden || document.webkitHidden) {
                                clearTimeout(downloadTimer);
                            }
                        });
                    window.addEventListener('pagehide', function() {
                        clearTimeout(downloadTimer);
                    });

            }
        
}
</pre>
        </div>
        <!-- 每一个信息 -->
        <div class="item-every">
            <h2>获取url中的参数值方法</h2>
<pre>
function  getQueryString(name) {
    const reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
    const urlObj = window.location;
    console.log()
    // if(urlObj.hash.split("?"))
    if(urlObj.hash.split("?").length>1){
        var r = urlObj.href.indexOf('#') > -1 ? urlObj.hash.split("?")[1].match(reg) : urlObj.search.substr(1).match(reg);
        
        if (r != null) return unescape(r[2]); return null;
    }else{
        return null
    }
   
}
</pre>
        </div>
        <!-- 每一个信息 -->
        <div class="item-every">
            <h2>将后台数据的Key值替换成自己想要的</h2>
<pre>
let respondList = JSON.parse(JSON.stringify(res.data)) 
let newData = [];
let obj = {};
respondList.map(item => {
    obj = item;
    obj['unitName'] = item['nameCn'];  
    obj['unit'] = item['countryCode'];  
    delete obj['nameCn'];
    delete obj['countryCode'];
    newData.push(obj)   
})
console.log(newData)//转换后的数据
</pre>
        </div>
         <!-- 每一个信息 -->
         <div class="item-every">
            <h2>vue解决父组件值改变使用v-for渲染的子组件无法重新更新视图的问题</h2>
<pre>
父组件  v-if='childData'

对应更新的位置写上
this.childData = false

setTimeout(() => {

this.childData = true

}, 0)
让视图重新更新下
</pre>
        </div>
          <!-- 每一个信息 -->
          <div class="item-every">
            <h2>js获取本月的42天数据,一个json对象。里面包含本月天数，时间搓等。</h2>
<pre>
    /**
    * @func getMonthInfo - desc:  得到某年份的具体某月份信息
    * @param { string } y - 当前年份
    * @param { string } m - 当前月份（已经是new Date的月份基础上大于1了）
    * @return { array } info - 返回一个info数组,年月日周几等信息;
    * @var { number } fdWeek - 该月第一天是周几
    * @var { number } ldWeek - 该月最后一天是周几
    * @var { number } lastDay - 当前月的最后一天
    * @var { number } lmDays - 上一个月的最后一天
    * @var { number } lmYear - 上一个月的年份
    * @var { number } lmMonth - 上一个月的月份
    * 通过获取m月的最后一天，得出m月共有多少天,并补全月份数据,只展示六周的日期
   */
   export const  getMonthInfo = function (y,m){
     let info = []
     let   fdWeek = new Date(y,m-1,0).getDay()/* 得到的日期是"m"月的前一个 月的最后一天 */
     let   ldWeek = new Date(y,m,0).getDay() /* 得到的日期是"m"月的后一个 月的第一天 */
     let   lastDay = new Date(y,m,0).getDate()
     let  lmDays =  new Date(y,m-1,0).getDate()
     let  lmYear = new Date(y,m-1,0).getFullYear()
     let   lmMonth = new Date(y,m-1,0).getMonth()+1
     let   nmYear = new Date(y,m+1,0).getFullYear()
     let  nmMonth = new Date(y,m+1,0).getMonth()+1
     console.log(lmDays,lmDays + (0-fdWeek))
     for(var i = lmDays, len = lmDays + (0-fdWeek); i>len; i--){
         info.unshift({
             year: lmYear,
             month: lmMonth, /* 上个月 */
             day: i,
             ishowBag:false,
             week: new Date(y,m-2,i).getDay(),
             todayData:{},
             timeFile:(new Date(`${lmYear}-${lmMonth<10?'0'+lmMonth:lmMonth}-${i<10?'0'+i:i}`)).getTime()
         });  
     }
     console.log(lastDay)
     for(var i = 1; i<=lastDay; i++){
         info.push({
             year: y,
             month: m, /* 本月 */
             day: i,
             ishowBag:false,
             week: new Date(y,m-1,i).getDay(),
             todayData:{},
             timeFile:(new Date(`${y}-${m<10?'0'+m:m}-${i<10?'0'+i:i}`)).getTime()
         });
     }
     for(var i = 1,len = 42-info.length; i<=len; i++){
         info.push({
             year: nmYear,
             month: nmMonth, /* 下个月 */
             day: i,
             ishowBag:false,
             todayData:{},
             week: new Date(y,m,i).getDay(),
             timeFile:(new Date(`${nmYear}-${nmMonth<10?'0'+nmMonth:nmMonth}-${i<10?'0'+i:i}`)).getTime()
         });
     }
     return info;
   };
</pre>
        </div>
         <!-- 每一个信息 -->
         <div class="item-every">
            <h2>将数组中的对象根据某个值进行归类放回的值也是数组</h2>
<pre>
function groupBy(array, f) {
        var groups = {};
        array.forEach(function (o) {
            var group = JSON.stringify(f(o));
            groups[group] = groups[group] || [];
            groups[group].push(o);
        });
        return Object.keys(groups).map(function (group) {
            return groups[group];
        });
}
var sorted = this.groupBy(list, function (item) {
    return [item.nam];
})
</pre>
        </div>
         <div class="item-every">
             图片：https://unsplash.com/s/photos/china-shanghai<br/>
             图片：https://pixabay.com/<br/>
             图片：https://www.pexels.com/zh-cn/<br/>
             jquery插件http://www.jq22.com/<br/>
             Navicat破解http://blog.happyjava.cn/articles/4.html<br/>
             GOOGLE插件下载：https://chrome.zzzmh.cn/index#index
         </div>
    </div>
</body>
</html>